/*
 * @Author: wangtao
 * @Date: 2020-08-20 14:07:42
 * @LastEditors: kanglang
 * @LastEditTime: 2021-08-03 19:02:20
 * @Description:
 */

import React from 'react';
import {
  View,
  StyleSheet,
  Image,
  Text,
  ImageBackground,
  TouchableOpacity,
} from 'react-native';
import { faceCard, iconCamera } from '@/images';
import { Button, msg, DashLine, Check } from '@/common';
import {
  isAndroid,
  mainBgColorLightGray,
  screenWidth,
  mainBgColorWhite,
  px2dp,
  fontColorBlack,
  fontColorLightGray,
  fontColorOrange,
  fontColorSecDeepGray,
  fontColorCoffee,
  fontColorDeepGray,
} from '@/styles';

import baseConfig from '@/config/baseConfig';
import { getAgreementByArray } from '@/common/agreement-version';
import CameraCard from './camera-card';

const { terminalCode } = baseConfig;
const { Submit } = Button;

export default class ChooseAgreement extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      // isAgree: true,
      agreementList: []
    };
  }

  componentDidMount() {
    // 货物运输协议
    getAgreementByArray(
      [{ appCode: terminalCode, code: 'logiticsAgreement', }],
      (data) => {
        this.setState({ agreementList: data });
      },
    );
  }

  switchChecked = () => {
    const { checked } = this.props;
    this.props.onChecked && this.props.onChecked(checked);
  }

  render() {
    const { checked } = this.props;
    const { agreementList } = this.state;
    return (
      <View
        style={{
          flexDirection: 'row',
          marginTop: px2dp(24),
          marginLeft: px2dp(32),
          alignItems: 'center',
          justifyContent: 'flex-start',
          width: screenWidth - px2dp(32),
        }}
      >
        <Check
          checked={checked}
          onCheck={this.switchChecked}
        />
        <Text style={{ fontSize: px2dp(24), marginLeft: 4 }}>我已阅读并同意</Text>
        {agreementList.map((item) => {
          if (!item || JSON.stringify(item) === '{}') return;
          return <TouchableOpacity
            activeOpacity={0.5}
            onPress={() => this.jumpAgreement(item)}
          >
            <Text style={{ color: fontColorCoffee, fontSize: px2dp(24) }}>
              {`《${item.title}》`}
            </Text>
          </TouchableOpacity>;
        })}
      </View>
    );
  }

  // 货物运输协议
  jumpAgreement = (item) => {
    msg.emit('router: goToNext', {
      routeName: 'CustAgreement',
      title: item.title,
      content: item.content
    });
  };
}

const styles = StyleSheet.create({});
